nav.m_nav {position:fixed;top:0px;left:0;z-index:-1;overflow:hidden;overflow-y:scroll;transform:translateY(115%);width:100vw;height:100vh;transition:all 600ms cubic-bezier(.8,0,.33,1);}
nav.m_nav::-webkit-scrollbar {width:0px;background:rgba(255,255,255,.3);}
nav.m_nav.nav-open {background:#fff;z-index:9991;transform:translateY(0);}
.menu-btn {cursor:pointer;z-index:99992;color:#444;transition:.36s all;}
.menu-btn:hover .line {background: var(--base_color);}
.nav-open .menu-btn {background:none;top: 11px;right:9px;position:fixed;}
.menu-btn .line {padding:0;width:30px;background:#444;height:1px;margin:6px 5px;transition:all 700ms cubic-bezier(.9,0,.33,1);}
.nav-open .menu-btn .line {background: var(--base_color);}
.menu-btn .line.line--1 {width:25px;transform:rotate(0) translateY(0);margin-left:auto;}
.menu-btn .line.line--1.line-cross {width:30px;transform:rotate(45deg) translateY(2px) translateX(4px);}
.menu-btn .line.line--2 {width:15px;transform:translateX(0);}
.menu-btn .line.line--2.line-fade-out {width:25px;transform:translate(30px);opacity:0;}
.menu-btn .line.line--3 {width:25px;transform:rotate(0) translateY(0);}
.menu-btn .line.line--3.line-cross {width:30px;transform:rotate(-45deg) translateY(-7px) translateX(7px);}
nav.m_nav .nav-links {position:absolute;left:0;top:0;width:100%;height:100%;transform:translateY(0);opacity:0;display:flex;flex-direction:column;justify-content:space-between;}
nav.m_nav .nav-links ul {width:100%;margin-top:5vh;}
nav.m_nav .nav-links.fade-in {opacity:1;transform:translateY(0);}
@media(min-width:992px) {
	a.menu-btn,.nav-open a.menu-btn {background:none;color:unset;position:relative;}
	.nav-open .menu-btn {display:block!important;}
}

nav.m_nav .hedear_slogan p:nth-child(1) { font-size: 14px; }
nav.m_nav .hedear_slogan p:nth-child(2) { font-size: 14px; }

nav.m_nav .navsub {display:none;}
nav.m_nav .nav-item {cursor:pointer;}
nav.m_nav .nav-item .link {width:96%;max-width:400px;font-size:16px;border-bottom: 1px solid #eee;margin:0 auto;padding:17px 10px;display:flex;align-items:center;justify-content:space-between;}
nav.m_nav .nav-item div.link:after {content:'\ec00';font-family:'iconfont';}
nav.m_nav .nav-item:first-child .link {font-weight:bold;border-bottom:none;margin-bottom:20px;}
nav.m_nav .nav-item:first-child:hover .link {background:none;}
nav.m_nav .nav-item:last-child .link {border-bottom:none;}
nav.m_nav .nav-item:hover .link,.nav-item.active .link {color:#fff;background: var(--base_color);}
nav.m_nav .nav-item:hover .link a,.nav-item.active .link a{color:#fff; background: var(--base_color);}
nav.m_nav .nav-item.active .link:after {transform: rotate(135deg);transition:.2s all linear;}
nav.m_nav .nav-item.active .link a {font-weight:bold;}
nav.m_nav .nav-item.active .navsub {display:block;}
nav.m_nav .nav-item.active .navsub a {animation:flipInX 1.5s;width:100%;padding: 17px 0;}
nav.m_nav .nav-subitem { padding: 0 15px; color:#444;border-bottom: 1px solid rgba(0,0,0,.1);width: 85%;font-size: 1rem;max-width: 400px;margin: 0 auto;display: flex;align-items: center;justify-content: space-between;}
nav.m_nav .nav-subitem a {display:block;}
nav.m_nav .nav-subitem a.active,nav.m_nav .nav-subitem a:hover,nav.m_nav .nav-subitem.active a {color: var(--base_color);}



nav.m_nav .navbottom {color:#fff;background: var(--base_color);border-top:1px solid  var(--base_color);position:relative;margin-top:20px;padding:20px 0;transform:translateY(100%);}
nav.m_nav .navbottom:after {content:'';position:absolute;z-index:9;right:0;top:0;bottom:0;width:0;height:0;transform:translateY(-100%);}
nav.m_nav .navbottom a {display:block;margin:0 auto;padding: 17px 10px; font-size: 2.0rem;
    border-bottom: 1px solid rgba(0,0,0, 0.3);width: 85%;position:relative; color: #ffffff;}
nav.m_nav .navbottom a:last-child {border-bottom:none;}
.nav-open nav.m_nav .navbottom {transform:translateY(0);transition: all 1000ms cubic-bezier(.8, 0, .33, 1);}

.nav-open nav.m_nav .navbottom i { font-size: 2.0rem; }
